<template>
  <div class="box-card">
    <el-breadcrumb separator="/" style="margin-bottom: 20px;">
      <el-breadcrumb-item>首页</el-breadcrumb-item>
      <el-breadcrumb-item>商品管理</el-breadcrumb-item>
      <el-breadcrumb-item>商品列表</el-breadcrumb-item>
    </el-breadcrumb>
    <el-card class="box-card" style="line-height: 0; text-align: left;">
      <div>
        <div style="width: 1300px; height: 700px">
          <div ref="chart"></div>
        </div>
      </div>
    </el-card>
  </div>
  <!-- </template>
<script>
export default {
  mounted() {
    this.$nextTick(() => {
      this.fetchData()
    })
  },
  methods: {
    async fetchData() {
      try {
        const res = await this.$Http.get('/reports/type/1')
        console.log(res);
        const myecharts = this.$echarts.init(this.$refs.chart)
        myecharts.setOption(res.data.data)
        window.addEventListener('resize', () => {
          myecharts.resize()
        })
      } catch (error) {
        console.log(error);
      }
    }
  }
}
</script> -->
  <script>
  export default {
    data()
    mounted() {
      this.$nextTick(() => {
        this.fetchData()
      })
    },
    methods: {
      async fetchData() {
        try {
          const res = await this.$Http.get('/reports/type/1')
          console.log(res);
          const myecharts = this.$echarts.init(this.$refs.chart)
          myecharts.setOption(res.data.data)
          window.addEventListener('resize', () => {
            myecharts.resize()
          })
        } catch (error) {
          console.log(error);
        }
      }
    }
  }
</script>
